import React, { Component } from 'react';
import { observable, useStrict, action } from 'mobx';
import { observer } from 'mobx-react';
import store from "../store/store";
import util from "../lib/commonJs"

/***
 * 一个基础类 可以提供全局 store 的获取，也可提供公用方法，若项目没有复杂的数据交互
 * 可以不使用mobx，原生的：
 * this.state = {//初始化
 *    a:1, b:2
 * }
 * this.setState({a:3});//修改
 */

class BaseApp extends Component {

    //给当前组件定义可操作的属性
    @observable module = "";

    constructor(props) {
        super(props);
        this.util = util;
        this.store = store;
        this.serverHost = store.server_HOST;

        this.GID = ()=>{
            return this.util.uuid(5);
        };


    }
    @action AJAX = (para)=>{
        return this.util.ajax(para);
    };

    // 组件初始化时只调用，以后组件更新不调用，整个生命周期只调用一次，此时可以修改state
    //componentWillMount(){}

    // 组件渲染之后调用，可以通过this.getDOMNode()获取和操作dom节点，只调用一次
    //componentDidMount(){}

    // 组件接受新的state或者props时调用，调用this.forceUpdate会跳过此步骤
    //shouldComponentUpdate(nextProps, nextState){}

    // 组件初始化时不调用，只有在组件将要更新时才调用，此时可以修改state
    //componentWillUpdate(nextProps, nextState){}

    //组件初始化时不调用，组件更新完成后调用，此时可以获取dom节点。
    //componentDidUpdate(){}

    //组件将要卸载时调用
    //componentWillUnmount(){}

    render() {}
}
class Head extends BaseApp {
    constructor(props){
	super(props);
    }
    render() {
	return (
            <div className={"app-head"}>
                <div className={"head-msg"}>
                    <div className={"head-text"}>区块链培训证书查询</div>
                    <i className="fa fa-graduation-cap"/>
                </div>
            </div>
	);
    }
}
class Foot extends BaseApp {
    constructor(props){
	super(props);
    }
    render() {
	return (
            <div className={"app-foot " + this.props.themeClass}>
                Copyright © 2018 苏州同济金融科技研究院
            </div>
	);
    }
}
export { BaseApp , Head , Foot }
export default BaseApp;
